import {Module} from 'vuex'
import {
  CHANGE_MENU_STATE,
  GET_COLLAPSE,
  ADD_TAG_ITEM,
  REDUCE_TAG_ITEM,
  CHANGE_ACTIVE,
} from '../mutation-types'

export const menuInfo: Module<menuInfoState, any> = {
  state: {
    isCollapse: false, //侧边栏是否展开
    TagBar: [], //首页tab标签列表
    routerList: [
      {
        value: 'default',
        label: '生产账套',
        baseUrl: 'http://192.168.100.91:8219',
        isChoose: true,
      },
      {
        value: 'test',
        label: '测试账套',
        baseUrl: 'http://193.168.100.90:8080',
        isChoose: false,
      },
      {
        value: 'temp',
        label: '临时账套',
        baseUrl: 'http://195.168.100.90:8080',
        isChoose: false,
      },
    ],
  },
  getters: {
    [GET_COLLAPSE] (state) {
      return state
    },
  },
  mutations: {
    [CHANGE_MENU_STATE] (state, {key, value}) {
      Object.assign(state, {[key]: value})
    },
    [CHANGE_ACTIVE] (state, index) {
      let barlist = state.TagBar
      barlist.forEach(function (item, index) {
        item.isactive = false
      })
      barlist[index].isactive = true
      Object.assign(state.TagBar, barlist)
    },
    [ADD_TAG_ITEM] (state, value) {
      let isNew = true // 校验是不是新标签
      let barlist = state.TagBar
      barlist.forEach(function (item, index) {
        item.isactive = false
        if (item.name === value.name) {
          isNew = false
          item.isactive = true
        }
      })
      Object.assign(state.TagBar, barlist)
      if (isNew) {
        state.TagBar.unshift(value)
      }
    },
    [REDUCE_TAG_ITEM] (state, index) {
      state.TagBar.splice(index, 1)
      state.TagBar[0].isactive = true
    },
  },
}

export interface menuInfoState {
  isCollapse: boolean,
  TagBar: TagBar[],
  routerList: routerList[],
}

export interface TagBar {
  name: string,
  path: string,
  isactive: boolean,
  title: string,
}

export interface routerList {
  value: string,
  label: string,
  baseUrl: string,
  isChoose: boolean,
}
